// 初始化参数
const config = {
    earthRadius: 100,    // 地球半径(px)
    orbitRadius: 180,    // 轨道半径(px)
    satelliteSize: 40,   // 卫星大小(px)
    rotationSpeed: 0.5,  // 旋转速度(度/帧)
    satelliteCount: 6     // 卫星数量
};

// 卫星数据
const satellites = [
    { id: 1, color: '#FF5252', image: 'satellite1.png', angle: 0 },
    { id: 2, color: '#FF4081', image: 'satellite2.png', angle: 60 },
    { id: 3, color: '#E040FB', image: 'satellite3.png', angle: 120 },
    { id: 4, color: '#7C4DFF', image: 'satellite4.png', angle: 180 },
    { id: 5, color: '#536DFE', image: 'satellite5.png', angle: 240 },
    { id: 6, color: '#448AFF', image: 'satellite6.png', angle: 300 }
];

// 初始化地球和卫星
function init() {
    const earth = document.getElementById('earth');
    earth.style.width = `${config.earthRadius * 2}px`;
    earth.style.height = `${config.earthRadius * 2}px`;
    
    // 创建卫星元素
    satellites.forEach(sat => {
        const satElement = document.createElement('div');
        satElement.className = 'satellite';
        satElement.id = `sat-${sat.id}`;
        satElement.innerHTML = `<img src="${sat.image}" alt="Satellite ${sat.id}">`;
        satElement.style.backgroundColor = sat.color;
        earth.appendChild(satElement);
    });
    
    // 开始动画
    animate();
}

// 动画循环
function animate() {
    // 更新卫星位置
    updateSatellites();
    
    // 继续动画循环
    requestAnimationFrame(animate);
}

// 更新所有卫星位置
function updateSatellites() {
    satellites.forEach(sat => {
        // 更新角度
        sat.angle = (sat.angle + config.rotationSpeed) % 360;
        
        // 计算3D位置
        const rad = sat.angle * Math.PI / 180;
        const x = Math.sin(rad) * config.orbitRadius;
        const z = Math.cos(rad) * config.orbitRadius;
        
        // 计算缩放比例（根据与正面的距离）
        const frontAngle = Math.abs((sat.angle + 90) % 180 - 90);
        const scale = 0.7 + 0.5 * (1 - frontAngle / 90);
        
        // 更新DOM
        const satElement = document.getElementById(`sat-${sat.id}`);
        satElement.style.transform = `
            translateX(${x}px) 
            translateZ(${z}px) 
            scale(${scale})
        `;
        satElement.style.zIndex = Math.round(scale * 100);
    });
}

// 添加交互控制
function addInteractivity() {
    const container = document.getElementById('container');
    let isDragging = false;
    let startX = 0;
    let currentRotation = 0;
    
    container.addEventListener('mousedown', (e) => {
        isDragging = true;
        startX = e.clientX;
        currentRotation = config.rotationSpeed;
    });
    
    container.addEventListener('mousemove', (e) => {
        if (!isDragging) return;
        
        const deltaX = e.clientX - startX;
        config.rotationSpeed = currentRotation + deltaX * 0.01;
    });
    
    container.addEventListener('mouseup', () => {
        isDragging = false;
    });
    
    container.addEventListener('mouseleave', () => {
        isDragging = false;
    });
}

// 初始化
window.onload = function() {
    init();
    addInteractivity();
};